<template>
  <div class="material-print" ref="print">
    <h2>{{ title }}</h2>
    <table cellspacing="0" cellpadding="0">
      <thead>
        <tr>
          <th>序号</th>
          <th>销售订单号</th>
          <th>订单交期</th>
          <th>物料编码</th>
          <th>物料名称</th>
          <th>主计量</th>
          <th>生产线</th>
          <th>生产日期</th>
          <th>生产数量</th>
          <th>完工数量</th>
          <th>未完工数量</th>
          <th>入库数量</th>
        </tr>
      </thead>
      <tbody v-if="printData.length > 0">
        <tr v-for="(item, index) in printData" :key="index">
          <td>{{ item.number }}</td>
          <td>{{ item.ppNumber }}</td>
          <td>{{ item.ppDate | inMaterTime }}</td>
          <td>{{ item.invCode }}</td>
          <td style="width: 150px">
            {{ item.invName }} {{ item.invAttribute }}
          </td>
          <td>{{ item.unitName }}</td>
          <td>{{ item.beltline }}</td>
          <td>{{ item.arrangeDate | inMaterTimeMill }}</td>
          <td>{{ item.invQuantity }}</td>
          <td>{{ item.productQuantity }}</td>
          <td>{{ item.notProductQuantity }}</td>
          <td>{{ item.wmQuantity }}</td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },
  mounted() {},
  props: {
    printData: {
      type: Array,
      default() {
        return [];
      },
    },
    title: {
      type: String,
      default() {
        return "";
      },
    },
  },
  filters: {
    //年月日
    inMaterTime(date) {
      let time = new Date(date);
      return (
        time.getFullYear() + "-" + (time.getMonth() + 1) + "-" + time.getDate()
      );
    },

    //年月日时分秒
    inMaterTimeMill(time) {
      let date = new Date(time);
      let year = date.getFullYear(),
        month = date.getMonth() + 1,
        day = date.getDate(),
        hours = date.getHours(),
        minutes = date.getMinutes(),
        seconds = date.getSeconds();

      if (hours == "0") {
        hours = "00";
      }
      if (minutes == "0") {
        minutes = "00";
      }
      if (seconds == "0") {
        seconds = "00";
      }
      return (
        year +
        "-" +
        month +
        "-" +
        day +
        " " +
        hours +
        ":" +
        minutes +
        ":" +
        seconds
      );
    },
  },
};
</script>

<style lang="scss" scoped="scoped">
@media print {
  .material-print {
    display: block !important;
  }
}

.material-print {
  display: none;

  h2 {
    text-align: center;
    color: #515a6e;
  }

  table {
    width: 100%;
    margin-bottom: 20px;
    border-left: 1px solid #ccc;

    th {
      text-align: center;
      font-size: 14px;
      padding: 5px;
      border-bottom: 1px solid #ccc;
      border-right: 1px solid #ccc;
      border-top: 1px solid #ccc;
    }

    td {
      text-align: center;
      font-size: 13px;
      color: #606266;
      border-bottom: 1px solid #ccc;
      border-right: 1px solid #ccc;
      padding: 5px;
    }
  }
}
</style>
